<template>
  <div id="chartLineBoxo" style="width: 100%; height: 400px"></div>
</template>
<script>
import echarts from 'echarts'
export default {
  mounted() {
    var chartDomo = document.getElementById("chartLineBoxo");
    var myCharto = echarts.init(chartDomo);
    var option;

    option = {
      title: {
        text: "吨汽耗燃料曲线",
        // subtext: "纯属虚构",
      },
      tooltip: {
        trigger: "axis",
      },
      legend: {
        data: ["指标值", "平均值"],
        right: '50px',
      },
      toolbox: {
        show: false,
        feature: {
          dataZoom: {
            yAxisIndex: "none",
          },
          dataView: { readOnly: false },
          magicType: { type: ["line", "bar"] },
          restore: {},
          saveAsImage: {},
        },
      },
      xAxis: {
        type: "category",
        boundaryGap: false,
        // data: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"],
        data: [
          "01",
          "02",
          "03",
          "04",
          "05",
          "06",
          "07",
          "08",
          "09",
          "10",
          "11",
          "12",
          "13",
          "14",
          "15",
          "16",
          "17",
          "18",
          "19",
          "20",
          "21",
          "22",
          "23",
          "24",
          "25",
          "26",
          "27",
          "28",
          "29",
          "30",
          "31",
        ],
      },
      yAxis: {
        type: "value",
        axisLabel: {
          formatter: "{value}",
        },
      },
      series: [
        {
          name: "指标值",
          type: "line",
          data: [
            0.19,
            0.195,
            0.17,
            0.175,
            0.157,
            0.16,
            0.169,
            0.15,
            0.165,
            0.168,
            0.161,
            0.192,
            0.16,
            0.155,
            0.18,
            0.165,
            0.185,
            0.157,
            0.158,
            0.157,
            0.197,
            0.163,
            0.151,
            0.181,
            0.17,
            0.145,
            0.163,
            0.173,
            0.171,
            0.146,
          ],
          //   markPoint: {
          //     data: [
          //       { type: "max", name: "最大值" },
          //       { type: "min", name: "最小值" },
          //     ],
          //   },
          markLine: {
            data: [
              { type: "average", name: "平均值" },
              {
                name: "指标值",
                yAxis: 0.21,
              },
            ],
          },
        },
        // {
        //   name: "最低气温",
        //   type: "line",
        //   data: [1, -2, 2, 5, 3, 2, 0],
        //   markPoint: {
        //     data: [{ name: "周最低", value: -2, xAxis: 1, yAxis: -1.5 }],
        //   },
        //   markLine: {
        //     data: [
        //       { type: "average", name: "平均值" },
        //       [
        //         {
        //           symbol: "none",
        //           x: "90%",
        //           yAxis: "max",
        //         },
        //         {
        //           symbol: "circle",
        //           label: {
        //             position: "start",
        //             formatter: "最大值",
        //           },
        //           type: "max",
        //           name: "最高点",
        //         },
        //       ],
        //     ],
        //   },
        // },
        {
            name: '平均值',
            type: 'line'
        }
      ],
      color: '#5470c6',
    };

    option && myCharto.setOption(option);
  },
  data() {
    return {};
  },
};
</script>
<style scoped>
</style>
